<template>
  <div class="opinion-trends">
    <div class="title"></div>
    <div class="main">
      <Summary />
      <SafetyChange />
    </div>
  </div>
</template>

<script setup lang="ts">
import { defineComponent } from 'vue';
import Summary from './summary/index.vue';
import SafetyChange from './safetyChange/index.vue';

defineComponent({ name: 'OpinionTrends' });
</script>

<style scoped lang="scss">
.opinion-trends {
  @apply w-full h-full flex flex-col justify-between;

  .title {
    @apply w-full h-[57px];
    background: url('./assets/title.png') no-repeat center;
  }

  .main {
    @apply w-full h-[calc(100%-78px)] flex flex-col;
  }
}
</style>
